<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:pe="http://primefaces.org/ui/extensions" >

    <f:view contentType="text/html; charset=ISO-8859-1">

        <h:head>
            <h:outputStylesheet name="css/style.css" />
            <h:outputStylesheet name="css/cssOverrides.css" />
            <h:outputScript name="js/utils.js" />
            <h:outputScript name="js/paginatorOverride.js" />

            <title>TestApp</title>
        </h:head>

        <h:body>
            <p:layout fullPage="true" id="template">

                <p:layoutUnit position="north" size="50"  id="header">

                    <ui:include src="header.xhtml" />

                </p:layoutUnit>

                <p:layoutUnit position="west" size="165" id="menu">

                    <ui:include src="menu.xhtml" />

                </p:layoutUnit>

                <p:layoutUnit position="center" id="center">

                    <p:growl globalOnly="true" showDetail="true" autoUpdate="true" life="2000" />
                    <!--<p:messages globalOnly="true" showDetail="true" autoUpdate="true" closable="true" />-->

                    <h:form id="loading">
                        <p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();" />
                        <p:dialog modal="true" widgetVar="statusDialog" header="Loading..." resizable="false" draggable="false" 
                                  closable="false" appendToBody="true" style="text-align: center;">
                            <p:graphicImage value="/resources/images/loader.gif" />
                        </p:dialog>
                    </h:form>

                    <pe:tooltip global="true" myPosition="left bottom" atPosition="right top" />

                    <p:outputPanel id="pageCentral" >
                        <ui:insert name="Content" />
                    </p:outputPanel>  

                    
                    <h:form id="pooling">
                        <!-- Refresh page after 60 seconds 
                        <p:poll interval="60" update=":pageCentral" listener="#{bean.loadAll()}" 
                                rendered="#{bean.editMode eq false}" global="false" /> --> 

                        <!--Refresh page after idle for 60 seconds, refresh again when back -->
                        <p:idleMonitor timeout="60000" rendered="#{bean.editMode eq false}">  
                            <p:ajax event="idle" update=":pageCentral" listener="#{bean.loadAll()}" global="false" />  
                            <p:ajax event="active" update=":pageCentral" listener="#{bean.loadAll()}" global="false" />  
                        </p:idleMonitor>  
                    </h:form>

                </p:layoutUnit>

            </p:layout>
        </h:body>

    </f:view>
</html>


